﻿<%@ Page Title="Nhân viên" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="List.aspx.cs" Inherits="QuanLyHopDong.Web.Employees.List" %>
<%@ Import Namespace="Resources" %>

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
    <div class="filtering">
        <%=GlobalStrings.Name %>:
        <input type="text" name="name" id="name" />
        <button type="submit" id="LoadRecordsButton"><%=GlobalStrings.LoadRecords %></button>
        <button type="submit" id="ResetButton"><%=GlobalStrings.Reset %></button>
    </div>
    <div id="EmployeesTableContainer">
    </div>
    <p><input type="button" value="<%=GlobalStrings.AddNew %>" onclick="javascript:window.location='New.aspx';" /></p>
    <script type="text/javascript">
        $(document).ready(function () {
            $('#EmployeesTableContainer').jtable({
                title: '<%=GlobalStrings.EmployeesList %>',
                paging: true,
                pageSize: 10,
                sorting: true,
                defaultSorting: 'Id ASC',
                actions: {
                    listAction: 'List.aspx/EmployeeList',
                    deleteAction: 'List.aspx/DeleteEmployee'
                },
                fields: {
                    Id: {
                        key: true,
                        create: false,
                        edit: false,
                        list: true,
                        title: 'ID'
                    },
                    Name: {
                        title: '<%=GlobalStrings.Name %>',
                        width: '30%'
                    },
                    UserName: {
                        title: 'Username'
                    },
                    Edit: {
                        title: '',
                        width: '1%',
                        display: function (data) {
                            return '<input title="<%=GlobalStrings.Edit %>" class="jtable-command-button jtable-edit-command-button" onclick="javascript:window.location=\'Edit.aspx?id=' + data.record.Id + '\';" />';
                        },
                        sorting: false
                    }
                }
            });
            
            //Re-load records when user click 'load records' button.
            $('#LoadRecordsButton').click(function (e) {
                e.preventDefault();
                $('#EmployeesTableContainer').jtable('load', {
                    name: $('#name').val()
                });
            });
            
            // Reset button
            $('#ResetButton').click(function (e) {
                e.preventDefault();
                $('#name').val('');
                $('#LoadRecordsButton').click();
            });

            //$('#EmployeesTableContainer').jtable('load');
            //Load all records when page is first shown
            $('#LoadRecordsButton').click();
        });
    </script>
</asp:Content>
